<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>user</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">

		<link rel="stylesheet" href="css/mui.min.css">
		<link rel="stylesheet" type="text/css" href="css/userStyle/user.css" />
	</head>

	<body>
		<div class="mui-content">
			<header class="mui-bar mui-bar-nav mui-bar-transparent" data-top='0' data-offset='140' data-duration='16'>
				<a class="mui-icon mui-icon-email mui-pull-right"></a>
				<a class="mui-icon mui-icon-settings mui-pull-right" style="margin-right: 10px;"></a>
			</header>
			<div class="register_login mui-back-org">
				<div class="position mui-overflow">
					<div class="uers_headImg mui-fl">
						<img id="toMsg" class="setImg" src="images/p3.jpg" />
					</div>
					<div class="login_register mui-fl">
						<span id="login">
							登录
						</span>/
						<span id="phone_reg">
							注册
						</span>
					</div>
				</div>
			</div>
			<!-- 我的列表 -->
			<div class="lists mui-back-fff">
				<ul class="mui-table-view mui-grid-view mui-grid-9">
					<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
						<a href="#">
							<span class="mui-icon mui-icon-home"></span>
							<div class="mui-media-body">我的收藏</div>
						</a>
					</li>
					<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
						<a href="#">
							<span class="mui-icon mui-icon-email"><span class="mui-badge mui-badge-red">5</span></span>
							<div class="mui-media-body">我的足迹</div>
						</a>
					</li>
					<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
						<a href="#">
							<span class="mui-icon mui-icon-chatbubble"></span>
							<div class="mui-media-body">我的评价</div>
						</a>
					</li>
					<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
						<a href="#">
							<span class="mui-icon mui-icon-location"></span>
							<div class="mui-media-body">我的好友</div>
						</a>
					</li>
					<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
						<a href="#">
							<span class="mui-icon mui-icon-search"></span>
							<div class="mui-media-body">答谢记录</div>
						</a>
					</li>
					<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
						<a href="#" id="address">
							<span class="mui-icon mui-icon-phone"></span>
							<div class="mui-media-body">我的地址</div>
						</a>
					</li>
				</ul>
			</div>
			<!-- 我的资产 -->
			<div class="zichan mui-back-fff">
				<div class="myheader">
					我的资产
				</div>
				<ul class="mui-table-view mui-grid-view mui-grid-9">
					<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
						<a href="#">
							<span class="mui-icon mui-icon-home"></span>
							<div class="mui-media-body">红包</div>
						</a>
					</li>
					<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
						<a href="#">
							<span class="mui-icon mui-icon-email"><span class="mui-badge mui-badge-red">5</span></span>
							<div class="mui-media-body">代金券</div>
						</a>
					</li>
					<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
						<a href="#">
							<span class="mui-icon mui-icon-chatbubble"></span>
							<div class="mui-media-body">钱包</div>
						</a>
					</li>
					<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
						<a href="#">
							<span class="mui-icon mui-icon-location"></span>
							<div class="mui-media-body">余额</div>
						</a>
					</li>
				</ul>
			</div>
			<!-- 更多推荐 -->
			<div class="tuijian mui-back-fff">
				<div class="myheader">
					更多推荐
				</div>
				<ul class="mui-table-view mui-grid-view mui-grid-9">
					<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
						<a href="#">
							<span class="mui-icon mui-icon-home"></span>
							<div class="mui-media-body">邀请有奖</div>
						</a>
					</li>
					<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
						<a href="#">
							<span class="mui-icon mui-icon-email"><span class="mui-badge mui-badge-red">5</span></span>
							<div class="mui-media-body">商家入住</div>
						</a>
					</li>
					<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
						<a href="#">
							<span class="mui-icon mui-icon-chatbubble"></span>
							<div class="mui-media-body">帮助与反馈</div>
						</a>
					</li>
					<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
						<a href="#">
							<span class="mui-icon mui-icon-location"></span>
							<div class="mui-media-body">在线客服</div>
						</a>
					</li>
				</ul>
			</div>
		</div>
	</body>
	<script src="js/mui.min.js"></script>
	<script>
		mui.init({
			swipeBack: true, //启用右滑关闭功能
			preloadPages: [{
				url: 'login.html',
				id: 'login'
			},{
				url: 'toMsg.html',
				id: 'toMsg'
			}]
		});
		var openWindow = function (parent,child) {
			mui(parent).on('tap', child, function() {
				var id = this.getAttribute('id'),
					urlName = id + '.html';
				mui.openWindow({
					url: urlName,
					id: urlName,
					show: {
						autoShow: true,
						aniShow: "auto",
					},
					waiting: {
						autoShow: true,
						title: '正在加载...'
					}
				})
			})
		}
		openWindow('.login_register','span');
		openWindow('.uers_headImg','#toMsg');
		openWindow('.mui-table-view-cell','a');
		document.addEventListener('setImg',function (event) {
			var imgPath = event.detail.imgPath;
			console.log(imgPath)
			mui('.uers_headImg .setImg')[0].src = imgPath;
		})
	</script>

</html>